/**
 * eadmin / www.eadmin.com.cn
 * 
 * 表格
 */

@import "../global";

.table
{
    position: relative;
    overflow-x: hidden;
    button{
        color: @font-color-3;
        text-shadow: 1px 1px 1px #36495C;
    }
    .table-box{
        position: relative;
    }
    .table-box, .fixed-left, .fixed-right
    {
        thead tr
        {
            border-bottom:1px @color-4 solid;
            background: darken(@color-2, 2%);
            .order
            {
                position: relative;
                padding: 2px 10px;
                i
                {
                    position: absolute;
                    left: 0;
                    cursor: pointer;
                    padding: 0 8px;
                }
                .asc
                {
                    top: -3px;
                }
                .desc
                {
                    bottom: -3px;
                }
                .active
                {
                    color: @color-3;
                }
            }
        }
        tbody
        {
            tr
            {
                &:nth-child(even){
                    background-color: darken(@color-2, 3%);
                }
                &:hover
                {
                    background-color: @color-11;
                }
            }
            img
            {
                height: 40px;
                width: 40px;
                vertical-align: middle;
            }
            a
            {
                color:lighten(@color-3, 20%) !important;
            }
            i
            {
                margin-right: 0;
            }
            .table-img-head
            {
                .border-radius(50px);
                border: 2px @color-3 solid;
                width: 32px;
                height: 32px;
            }
        }
        td:not(.td-checkbox)
        {
            min-width:100px;
            max-width: 500px;
            padding: 0 10px;
            height: 46px;
            white-space:nowrap;
            overflow:hidden;
            text-overflow:ellipsis;
        }
        label:not(.no-padding)
        {
            padding: 0 10px;
            margin: 0;
        }
        .td-checkbox
        {
            width: 40px;
            div
            {
                width: 40px;
            }
        }
        .head-border-top
        {
            border-top:1px @color-4 solid;
        }
        .tr-hover
        {
            background-color: @color-11 !important;
        }
    }
    .fixed-left, 
    .fixed-right
    {
        position: absolute;
        top: 0;
        background: @color-2;
    }
    .fixed-left
    {
        left: 0;
        box-shadow: 4px 0 10px 0px lighten(@shadow-color, 5%);
    }
    .fixed-right
    {
        right: 0;
        box-shadow: -4px 0 10px 0px lighten(@shadow-color, 5%);
    }
    .empty
    {
        height: 60px;
        line-height: 60px;
        text-align: center;
        color: @color-7;
        margin-bottom: 15px;
    }
}
.table-page
{
    text-align: right;
    margin-top: 10px;
    >span:not(.jump):not(.info)
    {
        .border-radius();
        .animate(background);
        padding: 5px 10px;
        cursor: pointer;
        margin-left: 4px;
        &:hover:not(.current)
        {
            .animate(background);
            background: @color-5;
        }
    }
    .prev-page,
    .next-page
    {
        padding: 5px 6px !important;
    }
    .prev-page > i,
    .next-page > i
    {
        margin-right: 0;
        vertical-align: text-top;
    }
    .current
    {
        color: @font-color-3;
        background: @color-3;
        &:hover
        {
            .animate(background);
            background: @color-3;
        }
    }
    .info
    {
        text-align: left;
        margin-right: 10px;
    }
    .jump
    {
        margin-left: 10px;
        input
        {
            width: 50px;
            margin: 0 2px;
        }
        button
        {
            margin-left: 6px;
        }
    }
    .select, 
    .select-option
    {
        margin-left:4px;
        margin-right: 4px;
    }
    .select
    {
        min-width: auto;
    }
}
.table-tools,
.table-search
{
    button
    {
        margin-right: 10px;
        padding: 8px 12px;
    }
    .form-group
    {
        min-height: unset;
    }
}
.table-search{
    .table-search-box{
        >div{
            padding-top: 0;
            padding-bottom: 10px;
        }
    }
}
.table-tools
{
    border-bottom:1px @color-4 solid;
    padding-bottom: 10px;
}
.table-shade
{
    width: 100%;
    min-height: 160px;
    text-align: center;
    display:flex;
    justify-content:center;
    align-items:center;
    display: none;
    color: @font-color-1;
}